﻿@{
	Layout = "~/Views/Shared/_Layout.cshtml";
}

@model dPet.Application.DataObjects.ServiceSKUPropertyDto

<div ng-controller="ServiceSKUPropertyValuesController">
	<div class="page-header">
		<h3>服务SKU属性值列表 [ 属性: @Model.BackendName ]</h3>
	</div>

	<div class="panel panel-default">
		<div class="panel-heading">
			<a href="@Url.Action("SKUPropertyList", "Service")" class="btn btn-default btn-sm"><span class="glyphicon glyphicon-chevron-left"></span> 返 回</a>
			<a href="javascript:;" class="btn btn-info btn-sm" title="添加SKU属性值" ng-click="showPropertyValue()"><span class="glyphicon glyphicon-plus-sign"></span> 添加SKU属性值</a>
		</div>
		<table class="table table-striped text-center">
			<thead>
				<tr>
					<th class="text-center">SKU属性值</th>
					<th class="text-center">最后修改时间</th>
					<th class="text-center">操作</th>
				</tr>
			</thead>
			<tbody>
				<tr ng-repeat='propertyValue in propertyValues'>
					<td>{{ propertyValue.Value }}</td>
					<td>{{ propertyValue.LastModified }}</td>
					<td>
						<a href="javascript:;" ng-click="showPropertyValue(propertyValue)">修改</a>
					</td>
				</tr>
			</tbody>
		</table>
	</div>
</div>

<script type="text/ng-template" id="propertyValueModal">
	<form ng-submit="savePropertyValue()">
		<div class="modal-header">
			<button type="button" class="close" ng-click="close()">&times;</button>
			<h4 class="modal-title">编辑SKU属性值</h4>
		</div>
		<div class="modal-body form-horizontal">
			<div class="form-group">
				<label class="col-md-3 control-label">属性值</label>
				<div class="col-md-9">
					<input type="text" class="form-control" placeholder="请输入SKU属性值" ng-model="mPropertyValue.Value" />
				</div>
			</div>
		</div>
		<div class="modal-footer">
			<button class="btn btn-info" type="submit">保 存</button>
		</div>
	</form>
</script>

@section scripts {
	<script type="text/javascript">
		$(document).ready(function () {
			set_left_nav('#ln_SKUPropertyList');
		});

		angular.module('dpet').controller('ServiceSKUPropertyValuesController', function ($scope, $modal, $http) {
			$scope.propertyValues = [];

			var loadPropertyValues = function (propertyId) {
				$http.post('/Ajax/ServiceSKUPropertyValues',
				{
					'propertyId': propertyId
				})
				.success(function (data) {
					if (data != null)
						$scope.propertyValues = data;
				})
				.error(function (result) {
					alert("系统繁忙");
				});
			}

			$scope.showPropertyValue = function (propertyValue) {
				if (propertyValue == undefined || propertyValue == null)
					propertyValue = {
						Id: '',
						Value: ''
					}

				var modalInstance = $modal.open({
					templateUrl: 'propertyValueModal',
					controller: PropertyValueModalController,
					size: 'sm',
					resolve: {
						propertyValue: function () {
							return propertyValue;
						}
					}
				});

				modalInstance.result.then(function (reload) {
					if (reload)
						loadPropertyValues('@Model.Id');
				});
			}

			loadPropertyValues('@Model.Id');
		});

		var PropertyValueModalController = function ($scope, $http, $modalInstance, propertyValue) {
			$scope.mPropertyValue = angular.copy(propertyValue);

			$scope.close = function () {
				$modalInstance.dismiss();
			};

			$scope.savePropertyValue = function () {
				$http.post('/Service/SaveSKUPropertyValue',
				{
					'propertyId': '@Model.Id',
					'propertyValueDto': $scope.mPropertyValue
				})
				.success(function (data) {
					alert(data.Message);

					$modalInstance.close(data.Success);
				})
				.error(function (result) {
					alert("系统繁忙");
				});
			}
		}
	</script>
}
